import React from 'react';
import RecordButton from '@/pages/Recruitment/containers/RecordButton';

const RecordButtonContainer = React.forwardRef(({ onChange }, ref) => {
    const [state, setState] = React.useState();
    const recordButtonRef = React.useRef();

    React.useEffect(() => {
        const getValue = async () => {
            const recordInfo = await recordButtonRef?.current?.getRecordInfo();
            onChange(recordInfo, state);
        };
        getValue();
    }, [state]);

    return (
        <div style={{ width: 115 }} ref={ref}>
            <RecordButton
                cRef={recordButtonRef}
                onChangeRecordState={value => {
                    setState(value);
                }}
            />
        </div>
    );
});

export default RecordButtonContainer;
